<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>

        <style>
            body {
                background-color: #f5f5f5;
            }
            *{
                margin: 0;
                padding: 0;
            }

            .cardRoot {
                width: 305px;
                height: 382px;
                background-color: white;
            }

            img {
                width: 200px;
                height: 200px;
            }

            .title {
                font-size: 20px;
                text-indent: 1em;
                line-height: 20px;
                color: #333;
            }

            .count {
                font-size: 22px;
                line-height: 42px;
                color: #333;
            }

            .type {
                font-size: 18px;
                line-height: 18px;
                color: #333;
            }

            .price {
                line-height: 60px;
                font-size: 22px;
                color: #9a3884;
            }

        </style>
    </head>
    <body>

        <div class="cardRoot">

            <img src="images/02.jpg" alt="dd">

            <p class="title">都港 冷冻无害化黄花鱼</p>
            <p class="count">700g 2条 袋装</p>
            <p class="type">海鲜水产</p>
            <p class="price">￥899</p>

        </div>

    </body>
</html>